﻿@model IList<CategoryModel>
@inject DisplayOrderHomePage order
<div class="product-grid col-12 px-0 order-@order.CategoryFeaturedProducts">
    <div class="flex-grid form-row">
        @foreach (var item in Model)
        {
            <div class="col-xl-@order.CF_c_Xl col-lg-@order.CF_c_Lg col-md-@order.CF_c_Md col-sm-@order.CF_c_Sm col-@order.CF_c_Col mb-3">
                    <div class="card p-0">
                        <div class="featured-list-picture">
                            <a href="@Url.RouteUrl("Category", new { SeName = item.SeName })" title="@item.PictureModel.Title">
                                <img class="img-fluid" alt="@item.PictureModel.AlternateText" src="@item.PictureModel.ImageUrl" title="@item.PictureModel.Title" />
                            </a>
                        </div>
                        <div class="list-title mt-3">
                            <h3 class="h5 card-title m-0 p-0">
                                <a href="@Url.RouteUrl("Category", new { SeName = item.SeName })">
                                    @item.Name
                                </a>
                            </h3>
                        </div>
                    </div>
            </div>
            <div class="col-xl-@order.CF_p_Xl col-lg-@order.CF_p_Lg col-md-@order.CF_p_Md col-sm-@order.CF_p_Sm col-@order.CF_p_Col">
                <div class="form-row flex-grid">
                    @foreach (var product in item.FeaturedProducts)
                    {
                        <div class="col-xl-@order.CF_pp_Xl col-lg-@order.CF_pp_Lg col-md-@order.CF_pp_Md col-sm-@order.CF_pp_Sm col-@order.CF_pp_Col featured-product-container mb-2">
                            <partial name="_ProductBoxFeatured" model="product" />
                        </div>
                    }
                </div>
            </div>
        }
    </div>
</div>
